<template>
  <div class="c-minh c-p c-bg-sgray">
    <section class="c-bg-white">
      <my-small-tabbar :tabList="tabList" :tabIndex="tabIndex" @changeTab="changeTab"></my-small-tabbar>
    </section>
    <div class="c-ph24">
      <div class="c-bg-white c-mt20 c-br12 c-pv28 c-ph24" v-for="(item, index) in list" :key="index">
        <div v-if="tabIndex == 0">
          <div class="c-fs24">领取人：{{item.nickname}} （ID：{{item.userId}}）</div>
          <div class="c-mt12 c-fs24">领取时间：{{item.cTime}}</div>
        </div>
        <div v-if="tabIndex == 1">
          <div class="c-fs24">操作名额：{{item.addNumber >= 0 ? '+' : ''}}{{item.addNumber}}</div>
          <div class="c-mt12 c-fs24">来源：{{item.from == 1 ? (item.addNumber >=0 ? '平台赠送' : '平台扣除') : typeMap[item.from]}}</div>
          <div class="c-mt12 c-fs24">操作时间：{{item.cTime}}</div>
        </div>
      </div>
      <loading-status-tem :dataStatus="dataStatus" noDataText="暂无明细"></loading-status-tem>
    </div>
  </div>
</template>

<script>
import MySmallTabbar from "@/components/templates/common/MySmallTabbar.vue";
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import { utilJs } from "@/utils/common.js";
let pageIndex = 0;
let loading = false;
const LIMIT = 10;
export default {
  name: 'ShCustomDetail',
  components: {
    loadingStatusTem,
    MySmallTabbar
  },
  props: [],
  beforeCreate() {},
  data() {
    return {
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : 'mb5_default',
      companyAuth: JSON.parse(localStorage.getItem("companyAuth")),
      id: '',
      prodId: '',
      prodType: '',
      cfrom: global.ckFrom,
      tabIndex: 0,
      tabList: [ //tab
        {
          title: "领取记录",
          index: 0
        },
        {
          title: "名额流水记录",
          index: 1
        }
      ],
      dataStatus: 'HAS_MORE_DATA',
      list: [],
      typeMap: {
        2: "用户领取",
        3: "身份变更增加",
        4: "身份变更扣除",
        5: "取消身份扣除"
      }
    }
  },
  created() {
    utilJs.appShare(this);
  },
  mounted() {},
  computed: {},
  watch: {},
  methods: {
    changeTab(num) {
      if (num != this.tabIndex) {
        this.tabIndex = num;
        pageIndex = 1;
        this.list = null;
        this.getInfoList();
      }
    },
    getInfoList() {
      if (loading == true) {
        return;
      }
      loading = true;
      let url = global.apiurl + `${this.tabIndex == 1 ? 'shareholder/getShareholderEquityLog' : 'shareholder/getPresentDetailLog'}?prodId=${this.prodId}&prodType=${this.prodType}&page=${pageIndex}&limit=${LIMIT}`;
      utilJs.getMethod(url, (res) => {
        if (pageIndex == 1) {
          this.list = res.data;
        } else {
          this.list = [...this.list, ...res.data];
        }
        if (res.data && (res.data.length < LIMIT)) {
          this.dataStatus = pageIndex == 1 && res.data.length == 0 ? 'NO_DATA' : 'NO_MORE_DATA';
        } else {
          this.dataStatus = 'HAS_MORE_DATA';
          pageIndex++;
        }
        loading = false;
      },
      () => {
        this.dataStatus = 'DATA_ERROR';
        loading = false;
      });
    },
    windowScrollFunction() {
      utilJs.handleLoading(() => {
        if (this.dataStatus == 'HAS_MORE_DATA' && this.list.length > 0 && loading == false) {
          this.getInfoList();
        }
      });
    },
    //分享
    wechatShare: function () {
      let shareUrl =
        window.location.href.split("#")[0] +
        "#/homePage/agent/agentIndex?fromType=shareholder&refereeId=" +
        localStorage.getItem("userId");
      if (localStorage.getItem("shareholderId")) {
        shareUrl += "&shareholderId=" + localStorage.getItem("shareholderId");
      }
      let title = "股东中心";
      let shareDesc = "点击查看详情";
      utilJs.wechatConfig(shareUrl, title, "", shareDesc, function () { });
    },
    //手机端分享
    appShare: function () {
      let shareUrl =
        window.location.href.split("#")[0] +
        "#/homePage/agent/agentIndex?fromType=shareholder&refereeId=" +
        localStorage.getItem("userId");
      if (localStorage.getItem("shareholderId")) {
        shareUrl += "&shareholderId=" + localStorage.getItem("shareholderId");
      }
      let title = "股东中心";
      let shareDesc = "点击查看详情";
      utilJs.appShareTrue(title, "", shareUrl, shareDesc);
    },
  },
  activated() {
    setDocumentTitle("赠送记录");// eslint-disable-line
    this.tabIndex = 0;
    this.id = this.$route.query.id || '';
    this.prodId = this.$route.query.prodId || '';
    this.prodType = this.$route.query.prodType || '';
    pageIndex = 1;
    this.dataStatus = 'HAS_MORE_DATA';
    this.list = [];
    this.getInfoList();
    this.$nextTick(() => {
      window.addEventListener('scroll', this.windowScrollFunction);
    });
    this.wechatShare();
  },
  deactivated() {
    window.removeEventListener('scroll', this.windowScrollFunction);
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.maxw240 {
  max-width: 6rem;
}
</style>
